<template>
    <view>
        <!-- parse <template is="myJoinTpl" :data="skin,sortItems,sortMenus,dataList,search,isTotalMenu:true"/> -->
        <block name="myJoinTpl">
            <block v-if="1">
                <cmpt-comm-list
                    type="my_join"
                    :search="search"
                    :_menus="sortMenus"
                    :_items="sortItems"
                    route="my/my_join_list"
                    :isTotalMenu="true"
                    sortMenusDefaultIndex="0"
                    topBottom="120"
                    placeholder="搜索标题"
                    @list="bindCommListCmpt"
                >
                    <view slot="searchEnd"></view>

                    <!-- List Begin -->
                    <view class="text-pic-list-box padding-project">
                        <view class="item card-project shadow-project" v-for="(item, index) in dataList.list" :key="index">
                            <view v-if="item.isTimeout" class="status">已结束</view>

                            <view @tap="url" :data-url="'../join_detail/my_join_detail?id=' + item._id" v-else-if="item.JOIN_STATUS == 1" class="qr">
                                <text class="icon-qrcode"></text>
                            </view>

                            <view class="title content-cut-two" @tap="url" :data-url="'../join_detail/my_join_detail?id=' + item._id">{{ item.JOIN_MEET_TITLE }}</view>

                            <view class="author" @tap="url" :data-url="'../join_detail/my_join_detail?id=' + item._id">
                                <text class="icon-time margin-right-xs text-s"></text>
                                <text class="text-cut">{{ item.JOIN_MEET_DAY }} {{ item.JOIN_MEET_TIME_START }}～{{ item.JOIN_MEET_TIME_END }}</text>
                            </view>

                            <view class="data" @tap="url" :data-url="'../join_detail/my_join_detail?id=' + item._id">
                                <text v-if="item.JOIN_STATUS == 1" class="text-green">
                                    <text class="icon-newshot margin-right-xxs"></text>
                                    预约成功{{ item.JOIN_IS_CHECKIN == 1 ? '，已签到' : '' }}
                                </text>

                                <text v-else-if="item.JOIN_STATUS == 10" class="text-grey">
                                    <text class="icon-bad margin-right-xxs"></text>
                                    已取消
                                </text>

                                <block v-else-if="item.JOIN_STATUS == 99">
                                    <text class="text-orange">
                                        <text class="icon-bad margin-right-xxs"></text>
                                        系统取消
                                        <text class="text-grey" v-if="item.JOIN_REASON">：{{ item.JOIN_REASON }}</text>
                                    </text>
                                </block>
                            </view>

                            <view class="data data-button">
                                <button @tap="url" :data-url="'../join_detail/my_join_detail?id=' + item._id" class="btn mid bg-gray text-black">查看详情</button>
                                <button
                                    v-if="(item.JOIN_STATUS == 1 || item.JOIN_STATUS == 0) && item.JOIN_IS_CHECKIN == 0"
                                    @tap="bindCancelTap"
                                    :data-id="item._id"
                                    class="btn mid bg-grey light"
                                >
                                    <text class="icon-close"></text>
                                    取消
                                </button>
                            </view>
                        </view>

                        <!-- load begin -->

                        <template is="listLoadTpl" :data="skin:'load-project',dataList" />
                        <!-- load end -->
                    </view>
                    <!-- List END -->
                </cmpt-comm-list>

                <!-- button Begin -->
                <!-- button END -->
            </block>
        </block>
    </view>
</template>

<script>
let behavior = require('../../../../behavior/my_join_bh.js');
let PassortBiz = require('../../../../biz/passport_biz.js');
let skin = require('../../skin/skin.js');
export default {
    data() {
        return {
            search: '',
            sortMenus: '',
            sortItems: '',

            dataList: {
                list: []
            }
        };
    },
    mixins: [behavior],
    onReady: function () {
        PassortBiz.initPage({
            skin,
            that: this,
            isLoadSkin: true
        });
        this.getSearchMenu(skin, this);
    },
    methods: {
        bindCommListCmpt() {
            console.log('占位：函数 bindCommListCmpt 未声明');
        },

        url() {
            console.log('占位：函数 url 未声明');
        },

        bindCancelTap() {
            console.log('占位：函数 bindCancelTap 未声明');
        }
    }
};
</script>
<style>
@import './my_join.css';
@import 'undefined';
</style>
